<template>
  <div class="dialog">
    <el-dialog :title="title" :visible.sync="visible" :close-on-click-modal="false" width="70%" append-to-body>
      <el-form ref="tblMain" :model="tblMain" labelPosition="right" inline="" label-suffix=":" label-width="80px">
        <el-row :span="24">
          <el-col :span="6">
            <el-button type="primary" size="small" @click="initTableData()">查询</el-button>
            <el-button size="small" @click="dataReset()">清空</el-button>
            <el-button size="small" @click="deleteEvent()">退货</el-button>
          </el-col>
        </el-row>
      </el-form>
      <el-table ref="tblMain" style="margin-top: 10px;" :data="tblMain.items" v-loading.body="tblMain.loading" border
        stripe @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="50" align="center"></el-table-column>
        <el-table-column type="index" width="80" label="序号" align="center"></el-table-column>
        <el-table-column prop="supplierName" label="经销商名称" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="productName" label="商品名称" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="qrCode" label="商品二维码" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orderId" label="订单编码" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="orderReturnSn" label="退款单编码" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column prop="storeBackStatus" label="门店退货状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.storeBackStatus == '0'">未退货</span>
            <span v-else-if="scope.row.storeBackStatus == '1'">已退货</span>
          </template>
        </el-table-column>
<!--        <el-table-column label="操作" align="center" width="150px">-->
<!--          <template slot-scope="scope">-->
<!--            <el-button type="text" @click="handleBack(scope.row)">退货</el-button>-->
<!--          </template>-->
<!--        </el-table-column>-->
      </el-table>
<!--      <el-pagination :current-page.sync="tblMain.currentPage" :page-size="tblMain.pageSize" :total="tblMain.total"-->
<!--        layout="total, sizes, prev, pager, next" @size-change="handleSizeChange"-->
<!--        @current-change="handleCurrentChange"></el-pagination>-->
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeNetWorker()">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  applyList,
  backProduct
} from '@/api/businessExtend'
import tool from '@/tool'
export default {
  name: 'StoreReturnDialog',
  data() {
    return {
      title: "养护单退货列表",
      visible: false,
      masterNo:'',
      tblMain: tool.genTableData({
        param: {
          name: '',
          phone: ''
        },
        items: []
      }),
    }
  },
  mounted() {
  },
  methods: {
    select() {
      this.visible = true;
      this.initTableData();
    },
    handleSelect(row) {
      this.$emit('ok', row);
      this.visible = false;
    },
    handleSelectionChange (val) {
      this.tblMain.selection = val;
    },
    closeNetWorker() {
      this.tblMain.items = [];
      this.visible = false;
    },
    // handleBack(row){
    //   backProduct(this.createForm).then((res) => {
    //     const data = res.data
    //     if (data.code == 0) {
    //       this.$message.success('新增成功');
    //       this.$emit('ok');
    //       this.closeNetWorker();
    //     } else {
    //       this.$message.error(data.data || '新增失败')
    //     }
    //   })
    // },
    edit(val){
      this.visible = true;
      this.masterNo = val.masterNo;
      this.initTableData();
    },
    handleSizeChange(val) {
      this.tblMain.pageSize = val
      this.initTableData()
    },
    handleCurrentChange(val) {
      this.tblMain.currentPage = val
      this.initTableData()
    },
    dataReset() {
      this.initTableData()
    },
    async deleteEvent () {
      if (this.tblMain.selection.length == 0) {
        this.$message.warning('请选择数据')
        return
      }
      let flag = false;
      this.tblMain.selection.forEach((element, index) => {
        let storeBackStatus = element.storeBackStatus;
        if(storeBackStatus == '1'){
          flag = true;
          return
        }
      })
      if(flag){
        this.$message.warning('已退货数据不能再次退货!')
        return
      }
      this.$confirm('确定退货选中数据?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let params = []
        this.tblMain.selection.forEach((element, index) => {
          params.push(element)
        })
        let paramData = {
          masterNo:this.masterNo,
          backParamList:params
        }
        backProduct(paramData).then(res => {
          let me = this
          let data = res.data
          if (data && data.code == 0) {
            me.$message.success('退货成功')
            this.initTableData()
          }
        }).catch(() => {
          me.$message.error('请求失败')
          me.tblMain.loading = false
        })
      }).catch(() => {
        // this.$message({
        //   type: 'info',
        //   message: '删除失败'
        // })
      })
    },
    initTableData() {
      let me = this
      let param = {
        masterNo: this.masterNo,
      }
      me.tblMain.loading = true

      applyList(param).then(res => {
        me.tblMain.loading = false
        let data = res.data
        if (data && data.code == 0) {
          me.tblMain.items = data.data
          me.tblMain.total = data.data.total
        }
      })
    },
  }
}
</script>

<style scoped></style>
